/* tabbar 底部标签
 *
 */
<template>
  <div class="">
    <van-tabbar v-model="activea" @change="change" placeholder z-index="100">
      <van-tabbar-item :icon="item.icon" v-for="item in list" :key="item.id">{{
        item.name
      }}</van-tabbar-item>
    </van-tabbar>
  </div>
</template> 

<script>
export default {
  name: "",
  props: {
    active: {
      type: Number,
      default: 0,
    },
  },
  components: {},
  data() {
    return {
      // active: 0,
      activea: this.active,
      list: [
        {
          id: 1,
          name: "首页",
          path: "/Home",
          icon:'wap-home-o' 
        },
        {
          id: 2,
          name: "社区",
          path: "/community",
          icon:'shop-o' 
        },
        {
          id: 3,
          name: "我的",
          path: "/my",
          icon:'friends-o'
        },
      ],
    };
  },
  methods: {
    change(e) {
      console.log(e);
      if (e == 2) {
        if (sessionStorage.getItem("token")) {
          this.$router.push(this.list[e].path);
        } else {
          this.$router.push("/login");
        }
      } else {
        this.$router.push(this.list[e].path);
      }
      // this.active = e
    },
  },

  created() {},

  mounted() {},

  computed: {},

  watch: {},
};
</script>

<style lang='scss' scoped>
</style>